<template>
	<view>
		<view class="main">
			<view class="title">添加普通视频</view>
			<view class="tit"><text>*</text>视频名</view>
			<input v-model="title" placeholder="随意取个名字吧" />
			<view class="tit"><text></text>普通视频</view>
			<input v-model="video_url" placeholder="普通视频" disabled />
			<shmily-drag-image :delImage="delImage" v-model="imgVideoArr" keyName="url"
				v-if="imgVideoArr.length!=0"></shmily-drag-image>
			<view class="flex align between btns">
				<view class="flex btn-item1" @click="toUpload()">
					<uni-icons type="upload" size="20" color="#fff"></uni-icons>
					<text>上传</text>
				</view>
				<view class="flex btn-item2" @click="toUrl(2)"><uni-icons type="list" size="20"
						color="#fff"></uni-icons>
					<text>选择</text>
				</view>
			</view>
			<view class="tit"><text>*</text>视频分组</view>
			<input placeholder="请选择" disabled @click="show = true" v-model="group_name" />
			<view class="subBtn" @click="toSubmit()">确定</view>
			<u-picker :show="show" :columns="groupList" keyName="name" @cancel="show = false"
				@confirm="confirm"></u-picker>
		</view>
	</view>
</template>

<script>
	import {
		tuiguangVideoGroup,
		aliossNotify,
		tuiguangVideoAdd
	} from '@/api/apiData.js';
	import {
		uploadOss
	} from '@/until/oss/oss.js'
	export default {
		data() {
			return {
				show: false,
				value: '',
				title: '',
				video_url: '',
				group_ids: '',
				groupList: [],
				group_name: '',
				imgVideoArr: []
			};
		},
		onLoad() {
			this.getGroup()
		},
		onShow() {
			if (uni.getStorageSync('imgVideoArr')) {
				this.imgVideoArr = uni.getStorageSync('imgVideoArr')
				let arr = []
				this.imgVideoArr.forEach((item => {
					arr.push(item.url)
				}))
				this.video_url = arr.toString()
			}
		},
		methods: {
			delImage(done) {
				let that = this
				uni.showModal({
					content: '是否删除?',
					success: (res) => {
						if (res.confirm) {
							// 执行 done() 删除

							done()
							let arr = []
							that.imgVideoArr.forEach((item => {
								arr.push(item.url)
							}))
							that.video_url = arr.toString()
							uni.setStorageSync('imgVideoArr', that.imgVideoArr);
						}
					}
				})
			},
			// 上传视频/图片
			toUpload() {
				let that = this
				uni.chooseMedia({
					count: 9,
					mediaType: ['video'],
					sourceType: ['camera', 'album'], //从相册选择
					success: (res) => {
						console.log(res)
						let fileArr = res.tempFiles
						let length = fileArr.length
						fileArr.forEach((item, index) => {
							console.log(item.tempFilePath)
							that.toOss(item.tempFilePath, index, item.fileType, item.size, new Date()
								.getTime())
						})
					},
					fail() {
						uni.hideLoading()
					}
				})
			},
			async toOss(item, index, fileType, size, name) {
				const time = uni.$u.timeFormat(new Date().getTime(), 'yyyymm/dd')
				let ossPath = await uploadOss({
					filePathFore: time + '/',
					filePath: item,
				})
				let url = 'https://hongchuquan.oss-cn-shanghai.aliyuncs.com/' + ossPath
				console.log(url)
				if (fileType == 'audio') {
					let arr = [{
						type: fileType,
						url: url
					}]
					this.audioArr = this.audioArr.concat(arr)
					let arr2 = []
					this.audioArr.forEach((item => {
						arr2.push(item.url)
					}))
					this.row.bg_audio = arr2.toString()
					uni.setStorageSync('audio', this.audioArr);
				}
				if (fileType == 'image' || fileType == 'video') {
					let arr = [{
						type: fileType,
						url: url
					}]
					this.imgVideoArr = this.imgVideoArr.concat(arr)
					let arrs = []
					this.imgVideoArr.forEach((item => {
						arrs.push(item.url)
					}))
					this.video_url = arrs.toString()
					uni.setStorageSync('imgVideoArr', this.imgVideoArr);
				}

				// this.toComf(url, fileType, size, name)
			},
			async toComf(url, fileType, size, name) {
				uni.showLoading({
					title: "loading",
					mask: true
				})
				const result = await aliossNotify({
					url: url,
					name: name,
					size: size,
					type: fileType,
				})
				if (result.code == 1) {
					uni.hideLoading()
					uni.showToast({
						title: '上传成功'
					})
				} else {
					uni.hideLoading()
					uni.showToast({
						title: result.msg,
						icon: 'error'
					})
				}
			},
			toUrl(n) {
				uni.navigateTo({
					url: '/pages/material/material?type=' + n
				})
			},
			async getGroup() {
				const result = await tuiguangVideoGroup()
				this.groupList = [result.rows]
			},
			confirm(e) {
				this.group_ids = e.value[0].id
				this.group_name = e.value[0].name
				this.show = false
			},
			toSubmit() {
				let obj = {
					'row[title]': this.title,
					'row[video_url]': this.video_url,
					'row[group_ids]_text': this.group_name,
					'row[group_ids]': this.group_ids,
				}
				if (this.title == '') {
					uni.showToast({
						title: '请输入视频名称',
						icon: 'none'
					})
					return false
				}
				if (this.video_url == '') {
					uni.showToast({
						title: '请选择视频',
						icon: 'none'
					})
					return false
				}
				if (this.group_ids == '') {
					uni.showToast({
						title: '请选择分组',
						icon: 'none'
					})
					return false
				}
				uni.request({
					url: 'https://jzxt.jiugezixun.cn/storeadmin/tuiguang_video/add?mode=undefined&dialog=1',
					data: obj,
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'X-Requested-With': 'XMLHttpRequest',
						'Cookie': uni.getStorageSync('cookies') // 从存储中读取cookies并设置到请求头
					},
					success: result => {
						if (result.data.code == 1) {
							uni.showToast({
								title: '添加成功'
							})
							setTimeout(() => {
								uni.removeStorageSync('imgVideoArr')
								uni.navigateBack()
							}, 500)
						} else {
							uni.showToast({
								title: result.data.msg,
								icon:'none'
							})
						}
					},
					fail: result => {
						uni.hideLoading();
					}
				})
				// const result = await tuiguangVideoAdd(obj)
				// if(result.code==1){
				// 	uni.showToast({
				// 		title:'添加成功'
				// 	})
				// 	setTimeout(()=>{
				// 		uni.removeStorageSync('imgVideoArr')
				// 		uni.navigateBack()
				// 	},500)
				// }else{
				// 	uni.showToast({
				// 		title:result.msg,
				// 		icon:'none'
				// 	})
				// }
			}
		}
	}
</script>

<style lang="scss" scoped>
	.main {
		margin-top: 15rpx;
		background: white;
		padding: 7rpx 30rpx;

		.title {
			font-size: 32rpx;
			font-weight: bold;
		}

		.tit {
			font-size: 28rpx;
			margin: 17rpx 0;

			text {
				color: #FF0000;
			}
		}

		input {
			padding: 14rpx 15rpx;
			font-size: 20rpx;
			border: solid 1rpx #707070;
			border-radius: 10rpx;
		}

		.btns {
			margin: 20rpx 40rpx;

			view {
				width: 250rpx;
				height: 60rpx;
				line-height: 60rpx;
				border-radius: 10rpx;
				justify-content: center;
				color: white;
				text-align: center;
			}

			.btn-item1 {
				background: #DD4E3D;
			}

			.btn-item2 {
				background: #5D9CEB;
			}

			text {
				margin-left: 10rpx;
			}
		}

		.btns2 {
			margin: 20rpx 0;

			view {
				width: 200rpx;
			}
		}

		.tips {
			font-size: 20rpx;
			margin: 15rpx 0;
		}

		.subBtn {
			font-size: 30rpx;
			color: white;
			padding: 8rpx 95rpx;
			background: #5D9CEB;
			width: fit-content;
			margin: 137rpx auto;
			border-radius: 10rpx;
		}
	}
</style>